<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>login</title>
	<style>
		/*css reset*/
		*{margin: 0; padding: 0;}
		.container{
			width: 100%; height: 560px;
			margin: 0 auto;
			background-image: url("img/login_bg.png");
			box-sizing: border-box;
			overflow-x: hidden;
		}
		a{
			color: #ffffff; font-size: 12px;
			text-decoration: none; /*去除下划线*/
		}
		.div_class{
			width: 280px; height: 296px; border-radius:3px;/*边框的倒角*/
			background-color: rgba(0,0,0,0.3);
			padding: 5px;
			/*margin: 0 auto;*/
			color: white;
			margin-top: 150px;
			margin-left: 550px;
		}
		.table_class{
			width:100%
		}
		hr{margin-top: 10px; margin-bottom: 10px}
		.input_uname_class, .input_upwd_class{
			width: 100%; height: 38px;
			outline: 0;     /*去除轮廓*/
			background-image: url("img/yhm.png");
			background-repeat: no-repeat;
			background-position: 95% center;
			font-size: 12px;
			padding-left: 20px;
			box-sizing: border-box;     /*改变盒子计算方式*/
		}
		span{
			color: red;
			font-size: 12px;
		}
		.input_upwd_class{
			background-image: url("img/mm.png");
			margin-top: 20px;
			margin-bottom: 25px;
		}
		label{font-size: 12px}
		.button_class{
			width: 100%; height: 36px;
			background: #0aa1ed;
			border: 0;
			color: white;
			text-align: center;
			margin-top: 20px;
		}
	</style>
	
</head>
<body>
<div class="container">
	<table></table>
	<div class="div_class">
		<table class="table_class" >
			<tr>
				<td width="50%"><h4>登录学子商城</h4></td>
				<td align="right"><a href="">新用户注册</a></td>
			</tr>
			<tr>
				<td colspan="2">
					<hr>
				</td>
			
			</tr>
			<tr>
				<td colspan="2">
					<input type="text" class="input_uname_class" placeholder="请输入您的用户名">
				</td>
			
			</tr>
			<tr>
				<td><span>用户名不能为空!</span></td>
				<td></td>
			</tr>
			<tr>
				<td colspan="2">
					<input type="text" class="input_upwd_class" placeholder="请输入您的密码">
				</td>
			</tr>
			<tr>
				<td>
					<input type="checkbox" id="checklogin">
					<label for="checklogin">自动登录</label>
				</td>
				<td align="right"><a href="">忘记密码?</a></td>
			</tr>
			<tr>
				<td colspan="2">
					<button class="button_class">登录</button>
				</td>
			</tr>
		</table>
	</div>
</div>




</body>
</html>